<template>
  <div>
    <h2>父组件</h2>
    <!-- v-model用在html标签上 -->
    <!-- <input type="text" v-model="username"> -->
    <!-- v-model底层原理: 动态的value值配合input事件 -->
    <!-- <input type="text" :value="username" @input="username = (<HTMLInputElement>$event.target).value"> -->


    <!-- v-model用在组件标签上 -->
    <!-- <ATguiguInput v-model="username"/> -->
    <!-- :modelValue="username: 实现数据到页面 -->
    <!-- 这里的 $event是传递过来的数据 -->
    <!-- <ATguiguInput :modelValue="username" @update:modelValue="username = $event"/> -->

    <!-- 修改modelValue -->
    <ATguiguInput v-model:ming="username" v-model:mima="password"/>
    
  </div>
</template>

<script setup lang="ts">
  import ATguiguInput from './ATguiguInput.vue';
  import { ref } from 'vue' 
  let username = ref('zhangsan')
  let password = ref('123123')
</script>

<style>

</style>